<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Document</title>
		<script src="__JQ__/jquery.js"></script>
		
	</head>
<body>
		
		
	<!--用户列表显示-->
	<div class="lb">
	<div style="margin-left:300px" id="searc">
	<form action="<{:U('orderList')}>" method="post">
		<input type="text" name="sou" value="" style="width:200px;height:30px" id="sub">
		<input type="submit" name="sub" value="搜索">
	</form>
	</div>
	<form action="" method="" class="list">
	<input id='ids' type='hidden' name='ids'/> 
		<table width="98%" border="0" cellpadding="2" cellspacing="1" bgcolor="#CFCFCF" align="center" style="margin-top:8px">
			<tr align="center" bgcolor="#FBFCE2" height="25">
				<td>订单编号</td>
				<td><input type="checkbox" name="" value="" id="s_all">选择</td>
				<td>下单时间</td>
				<td>收货人</td>
				<td>配送地址</td>
				<td>应付金额</td>
				<td>订单状态</td>
				<td>操作</td>
			</tr>

			<volist name="res" id="v">
			<tr align="center" bgcolor="#FFFFFF" height="26" align="center" border=1 onMouseMove="javascript:this.bgColor='#FCFDEE';" onMouseOut="javascript:this.bgColor='#FFFFFF';" id="user_<{$v.uid}>">
				<tr onMouseOver="this.style.background='#FFCC66'" onMouseOut="this.style.background='#fff';" bgcolor="#CCCCCC" >
		   <td align="center"class="num">
				<input type="checkbox" name="row[]" value="" class="c1"><{$v.order_id}>
		   </td>    
		   <td align="center" class="order_time"><{$v.order_time}> </td>
			<td align="center" class="name">
				<span class="name"><{$v.getperson}>
				</span>
			</td>
		
			 <td align="center" class="address">
			<span class="name"><{$v.getaddress}>
			</span></td>
			<td align="center" class="price">
			<span class="price">￥<{$v.money}>
			</span></td>
			<td align="center" class="onsale">
			 <span class="order_now">
				<if condition="$v.order_now eq 1">已经完成</if>
				<if condition="$v.order_now eq 2">等待确认</if>
				<if condition="$v.order_now eq 3">等待发货</if>
				<if condition="$v.order_now eq 4">等待付款</if>
				<if condition="$v.order_now eq 5">已经发货</if>
				<if condition="$v.order_now eq 6">已经付款</if>
				<if condition="$v.order_now eq 7">已经取消</if>
			 </span>
			</td>
				<td>
					<div id="widget">
						<input data-uid="<{$v.uid}>" type="button" name="del" value="删除">
						<input data-uid="<{$v.uid}>" type="button" name="edit" value="修改">
					</div>
				</td>
			</tr>
			</volist>

			<tr align="left">
				<td colspan=8  height="40px" id="widget2">
				<input type="button" name="add" value="添加新用户">
				<input type="button" id="f_all" value="反选" >
				<input type="button" value="删除" name="dele"><div style="float:right;margin-top:10px"><{$page}></div>
				</td>
			</tr>
			</table>
		</form>
	</div>
	<div clear="both"></div>	
	<script>
	//预览原图
	 var ShowImage = function () {  
            xOffset = 10;  
            yOffset = 30;  
            $(".face").find("img").hover(function (e) {  
                $("<img id='imgshow' src='" + this.src + "' />").appendTo("body");  
                //下面是两种样式赋值方法  
                //$("#imgshow").css("top", (e.pageY - xOffset) + "px").css("left", (e.pageX + yOffset) + "px").fadeIn("slow");  
                $("#imgshow").css({"top":(e.pageY - xOffset) + "px","left":(e.pageX + yOffset) + "px"}).fadeIn("slow");  
            }, function () {  
                $("#imgshow").remove();  
            });  
        };  
  
  
        jQuery(document).ready(function () {  
            ShowImage();  
        });  



	$('#face').mouseover(function(){
		$("#face img").attr("src",$(this).attr("src"));
		
		});

	//全选反选
	$(function(){	
		$('#s_all').click(function(){
			$('.c1').prop('checked',$(this).prop('checked'));	
		});
		
		$('#f_all').click(function(){
			$('.c1').map(function(k,v){
				var flag = $(v).prop('checked');
				$(v).prop('checked',!flag);
			});			
		});
	});

	$( function() {
     $( "#sub" ).autocomplete({
      source: "<{:U('search')}>",
      
    });
  });
	//按钮控件
	$(function(){
		$( "#widget input[type=button],#widget2 input[type=submit],#widget2 input[type=button],#searc input[type=submit],.hyxt input[type=button]").button();
		$( "#widget ").click( function( event ){
			event.preventDefault();
		});
	
	//删除单个弹窗
	$(function(){
	$('[name="del"]').click(function(){
		var uid = $(this).attr('data-uid');
		$( "<div>确定删除吗?</div>" ).dialog({
		  resizable: false,
		  title:"删除",
		  height: "auto",
		  width: 350,
		  modal: true,
		  buttons: {
			"确认删除": function() {
			  $( this ).dialog( "close" );
			  $.get('<{:U("userDel")}>',{uid:uid},function(data){
			if(data.status){				
				$('#user_'+uid).remove();
				$('.msg').text(data.msg);
				$('.msg').slideDown('fast');
				setTimeout(function(){$('.msg').slideUp('fast');},1600);				
			}else{
				$('#user_'+uid+' [name="del"]').val('删除');
				$('.msg').text(data.msg);
				$('.msg').slideDown('fast');
				setTimeout(function(){$('.msg').slideUp('fast');},1600);
				}			
			},'json');
			},
			"取消": function() {
			  $( this ).dialog( "close" );
			}
		  }
		});
	});
	//会员列表
	//$('[name="hylb"]').click(function(){

		//$('.lb').show();
	//});

	//修改的弹窗
	$('[name="edit"]').click(function(){
		var uid = $(this).attr('data-uid');
		$('.v-edit [name="uid"]').val(uid);
		$.get('<{:U("chaxun")}>',{uid:uid},function(data){
			console.log(data);
			$('.v-edit [name="uname"]').val(data.uname);
			$('.v-edit [name="email"]').val(data.email);
			$('.v-edit [name="phone"]').val(data.phone);
			$('.v-edit [name="age"]').val(data.age);
			//$('.v-edit [name="sex"]').val(data.sex);			
			//$('.v-edit [name="type"]').val(data.type);
				
		},'json');

		$( '.v-edit' ).dialog({
		  resizable: false,
		  title:"修改",
		  height: 330,
		  width: 380,
		  modal: true,
		  buttons: {
			"确认修改": function() {
				var uname = $('.v-edit [name="uname"]').val();
				var uid = $('.v-edit [name="uid"]').val();
				var email =	$('.v-edit [name="email"]').val();
				var phone = $('.v-edit [name="phone"]').val();
				var age = $('.v-edit [name="age"]').val();
				//var age = $('.v-edit [name="sex"]').val();
				//var age = $('.v-edit [name="type"]').val();
			  
			  $.post('<{:U("edit")}>',{uid:uid,uname:uname,email:email,phone:phone,age:age},function(data){
				$('#user_'+uid+' td:eq(3)').text(uname);
				$('#user_'+uid+' td:eq(6)').text(phone);
				$('#user_'+uid+' td:eq(7)').text(email);
				$('#user_'+uid+' td:eq(5)').text(age);
				//$('#user_'+uid+' td:eq(4)').text(sex);
				//$('#user_'+uid+' td:eq(8)').text(type);

				$('.msg').text(data.msg);
				$('.msg').slideDown('fast');
				setTimeout(function(){$('.msg').slideUp('fast');},1600);			
				},'json');
				$( this ).dialog( "close" );
				},
				"取消": function() {
				  $( this ).dialog( "close" );
			}
		  }
		});
	});

	//添加用户的弹窗
	$('[name="add"]').click(function(){	
		$( '.tj' ).dialog({
		  resizable: false,
		  title:"添加新用户",
		  height: 330,
		  width: 380,
		  modal: true,
		  buttons: {
			"确认添加": function() {
				var uname = $('.tj [name="uname"]').val();
				var email =	$('.tj [name="email"]').val();
				var phone = $('.tj [name="phone"]').val();
				var age = $('.tj [name="age"]').val();
				var sex = $('.tj [name="sex"]').val();
				//var face = $('.tj [name="face"]').val();
				var type = $('.tj [name="type"]').val();
			  
			  $.post('<{:U("userAdd")}>',{uname:uname,email:email,phone:phone,age:age,sex:sex,type:type},function(data){
				$('.msg').text(data.msg);
				$('.msg').slideDown('fast');
				setTimeout(function(){$('.msg').slideUp('fast');},1600);			
				},'json');
				$( this ).dialog( "close" );
				},
				"取消": function() {
				  $( this ).dialog( "close" );
			}
		  }
		});
	});
	});
	
	 $( function() {
    $( "#accordion" ).accordion({
      collapsible: true
    });
  });
  //可删除多个的弹窗
  $( function() {
		$('[name="dele"]').click(function(){
			var arr = [];      
		$('input:checked').each(function(){   //所有为checked状态的多选框   
			arr.push(this.value);  
		});  
		if(arr.length == 0 ){ 
		  $( '<div>请选择需要删除的记录</div>').dialog({
		  resizable: false,
		  title:"!提示",
		  height: "auto",
		  width: 350,
		  modal: true,
		  buttons: {
			"确定": function() {
				$( this ).dialog( "close" );
			
			},
		  }
		});
			//alert("请选择需要删除的记录");  
			return;  
		}  
			
		var len = $("input[name='row[]']:checked").length;
		console.log(len);
		console.log(arr);
		$( '<div>确定删除这<font color="red">'+len+'</font>项吗?删除后不可恢复!</div>').dialog({
		  resizable: false,
		  title:"删除",
		  height: "auto",
		  width: 350,
		  modal: true,
		  buttons: {
			"确认删除": function() {
				$( this ).dialog( "close" );
			  $.post('<{:U("Del")}>',{arr:arr},function(data){
			if(data.status){				
				$("input[name='row[]']:checked").each(function() {              
				$(this).parent().parent().remove(); 
				});
				$('.msg').text(data.msg);
				$('.msg').slideDown('fast');
				setTimeout(function(){$('.msg').slideUp('fast');},1600);				
			}
			},'json');
			
			},
			"取消": function() {
			  $( this ).dialog( "close" );
			}
		  }
		});
	});
	});
});

	</script>
</body>
</html>